import React from 'react'
// ===================================================================== Temp
import Table from '#cpt/temp/Table'
import Controls from '#cpt/temp/Controls'
import Delete from '#cpt/temp/Delete'
// ===================================================================== Declare
const { $fn, $Lazy } = window
// ===================================================================== Lazy
const Box 					= $Lazy.load(()=>import('#tp/box/box'))
const PermissionAddModal 	= $Lazy.state(()=>import('./permission-add-modal'))
// ===================================================================== component
class Index extends React.Component{
	state = {
		data:[],
		pag: {},
		selectedKeys:[],
		// 提交表单列表
		formData : [
			{ label: '名称',		name: 'scene_name',		required:true,	full:true },
			{ label: '状态',		name: 'scene_status',	required:true,	full:true,	type: 'select',	data:[
				{name: '启用', value: '1'}, {name: '未启用', value: '0'},
			] },
			{ label: '排序',		name: 'scene_sort',		required:true,	full:true,	value: 50 },
			{ label: '备注',		name: 'scene_remark',	required:true,	full:true,	type: 'textarea' },
		],
	}
	
	model = {}

	// 控制按钮
	query = {scene_uuid: ''}
	
	componentDidMount(){
		
	}
	
	load = ({ uuid }) => {
		this.query = { scene_uuid: uuid }
		this.fetch()
	}
	
	// paging
	fetch = () => $fn.fetch.call(this, 'conf-scene-permission/index')

	// 表单
	cols = [
		{ title: '权限名称', 		dataIndex: 'perm_name' },
		{ title: '权限描述', 		dataIndex: 'perm_desc' },
		{ title: '权限代码', 		dataIndex: 'perm_code' }
	]
	
	// 操作按钮
	controls = () => [
		Controls.click.call(this, '添加', ()=> this.PermissionAddModalRef.open(this.query.scene_uuid), {isKeys: !this.query.scene_uuid}),
		this.onDel()
	]
	
	onDel = uuid => Delete.call(this, 'conf-scene-permission/del', { uuid, isKeys: !uuid, idStr: 'uuids' })
	
	render(){
		return (
			<>
				<Box title='权限名称'  className='ex ml5' flex contentClassName='rel fv xplr mt10' controls={this.controls()}>
					{/* 表格 */}
					{ Table.call(this, {wrapClassName: 'mlr'}) }
				</Box>
				<PermissionAddModal onRef={ ref => this.PermissionAddModalRef = ref} onRefresh={this.fetch}  />
			</>
		)
	}
}

export default Index